<template>
    <div>
        <van-nav-bar title="VIVO手机专用商场" fixed />
        <div style="width: 100%; height: 50px;"></div>
        <van-tabs  v-model:active="active" animated>
            <van-tab title="官方正品">首页</van-tab>
            <van-tab title="极速物流">物流</van-tab>
            <van-tab title="全国联保">保障</van-tab>
            <van-tab title="免费定制">定制</van-tab>
        </van-tabs>
        <swipe></swipe>
        <Grid></Grid>
        <div style="width: 100%; height: 36px;">
                <span><img src="../../images/1.png" alt="" style="width: 50px; height: 40px;"></span>
                <span>距离本场结束</span> <span style="background: red; color: #fff;">08</span>: <span style="background: red; color: #fff;">24</span>: <span style="background: red; color: #fff;">29</span>
        </div>
        <div style="width: 100px; height: 100px;">
            <dl>
                <dt><img src="../../images/2.png" alt="" style="width: 100px; height: 100px;"></dt>
                <dd>
                     <span>耳机</span>
                </dd>
            </dl>
        </div>
        <div style="width: 100px; height: 100px; margin-left: 130px; margin-top: -115px;">
            <dl>
                <dt><img src="../../images/3.png" alt="" style="width: 100px; height: 100px;"></dt>
                <dd>
                     <span>耳机</span>
                </dd>
            </dl>
        </div>
         <div style="width: 100px; height: 100px; margin-left: 260px; margin-top: -115px;">
            <dl>
                <dt><img src="../../images/3.png" alt="" style="width: 100px; height: 100px;"></dt>
                <dd>
                     <span>耳机</span>
                </dd>
            </dl>
        </div>
    </div>
</template>

<script setup>
import Grid from '@/components/Grid.vue';
import swipe from '@/components/swipe.vue';
</script>

<style lang="scss" scoped></style>